<template>
	<div class="AlarmRecord">
		<el-card shadow="never">
		    <el-row>
				<el-col :span="5">
					<span class="label">
						巡检时间： 
					</span>	
					 <el-date-picker
					      v-model="date"
					      type="datetime"
						  class="select"
					      placeholder="请选择巡检时间">
					    </el-date-picker>
				</el-col>
			    <el-col :span="5">
					<span class="label">
						巡检轮次：
					</span>	
					<el-select class="select" placeholder="请选择巡检轮次"  v-model="round">
					   	<el-option
					   	      v-for="item in rounds"
					   	      :key="item.value"
					   	      :label="item.label"
					   	      :value="item.value">
					   	 </el-option>
					</el-select>	
			    </el-col>
				<el-col :span="5">
					<span class="label">
						平均温度：
					</span>	
					<el-input placeholder="" :disabled=true  class="select"   v-model="temperature"></el-input>	
				</el-col>
				
				<el-col :span="5">
					<span class="label">
						平均湿度：
					</span>	
					<el-input placeholder="" :disabled=true  class="select"  v-model="humidity"></el-input>
				</el-col>

		        <el-col :span="4" >
					<el-button type="primary" size="small" style="margin-left:5px;float:right;">导出</el-button>
					<el-button type="primary" size="small" style="margin-left:5px;float:right;" @click="reset()">重置</el-button>
					<el-button type="primary" size="small" style="float:right;" @click="search()">查询</el-button>
					
			   </el-col>
		    </el-row>
			
		</el-card>	
		<br/>
		<el-tabs v-model="activeName" type="card">
			<el-tab-pane label="气室压力" name="first">
				<el-table
				    :data="tablePressure"
					:header-cell-style="{background:'#F5F7FA'}"
				    border
				    style="width: 100%">
				    <el-table-column
				      prop="no"
				      label="编号"
					   align="center"
				      >
				    </el-table-column>
				    </el-table-column>
				    <el-table-column
				      label="气室压力(Mpa)"
					  align="center"
					  >
						<el-table-column
						  prop="temperature"
						  label="断口"
						  align="center"
						  >
						</el-table-column>
						<el-table-column
						  prop="temperature"
						  label="母线刀闸"
						  align="center"
						  >
						</el-table-column>
						<el-table-column
						  prop="humidity"
						  label="接地刀闸"
						  align="center"
						  >
						</el-table-column>
				    </el-table-column>
					<el-table-column
					  prop="temperature"
					  label="动作计数器"
					  align="center"
					  >
					</el-table-column>
					<el-table-column
					  prop="humidity"
					  label="电缆终端油位"
					  align="center"
					  >
					</el-table-column>
					
					<el-table-column
					  prop="humidity"
					  label="状态"
					  align="center"
					  >
					</el-table-column>
				  </el-table>
			</el-tab-pane>
			<el-tab-pane label="电缆温度" name="second">
				<el-table
				    :data="tableTemperature"
					:header-cell-style="{background:'#F5F7FA'}"
				    border
				    style="width: 100%">
				    <el-table-column
				      prop="no"
				      label="编号"
					   align="center"
				      >
				    </el-table-column>
				    </el-table-column>
				    <el-table-column
				      prop="temperature"
				      label="温度(℃)"
					  align="center"
					  >
				    </el-table-column>
					<el-table-column
					  prop="humidity"
					  label="电流(A)"
					  align="center"
					  >
					</el-table-column>
					<el-table-column
					  prop="humidity"
					  label="状态"
					  align="center"
					  >
					</el-table-column>
				  </el-table>
			</el-tab-pane>
			<el-tab-pane label="避雷器动作次数" name="third">
				<el-table
				    :data="tableArrester"
					:header-cell-style="{background:'#F5F7FA'}"
				    border
				    style="width: 100%">
				    <el-table-column
				      prop="no"
				      label="避雷器编号"
					   align="center"
				      >
				    </el-table-column>
				    <el-table-column
				      prop="temperature"
				      label="动作次数"
					  align="center"
					  >
				    </el-table-column>
					<el-table-column
					  prop="humidity"
					  label="状态"
					  align="center"
					  >
					</el-table-column>
				  </el-table>
			</el-tab-pane>
			<el-tab-pane label="测控柜" name="fourth">
				<el-table
				    :data="tableCabinet"
					:header-cell-style="{background:'#F5F7FA'}"
				    border
				    style="width: 100%">
				    <el-table-column
				      prop="no"
				      label="编号"
					   align="center"
				      >
				    </el-table-column>
				    <el-table-column
				      prop="temperature"
				      label="检测项"
					  align="center"
					  >
				    </el-table-column>
					<el-table-column
					  prop="humidity"
					  label="数值"
					  align="center"
					  >
					</el-table-column>
					<el-table-column
					  prop="humidity"
					  label="状态"
					  align="center"
					  >
					</el-table-column>
				  </el-table>
			</el-tab-pane>
			<el-tab-pane label="其他" name="fifth">
				<el-table
				    :data="tableOthers"
				    border
					:header-cell-style="{background:'#F5F7FA'}"
				    style="width: 100%">
				    <el-table-column
				      prop="no"
				      label="编号"
					   align="center"
				      >
				    </el-table-column>
				    <el-table-column
				      prop="temperature"
				      label="仪表类型"
					  align="center"
					  >
				    </el-table-column>
					<el-table-column
					  prop="temperature"
					  label="检测项"
					  align="center"
					  >
					</el-table-column>
					<el-table-column
					  prop="humidity"
					  label="数值"
					  align="center"
					  >
					</el-table-column>
					<el-table-column
					  prop="humidity"
					  label="状态"
					  align="center"
					  >
					</el-table-column>
					
				  </el-table>
			</el-tab-pane>
		</el-tabs>

	</div>
</template>

<script>
	export default {
		data() {
			return {
				   activeName: 'first',//Tab选中标签
				   temperature:'30℃',
				   humidity:'aa',
				   refresh:true,
				   disabled:true,
				   //搜索框
				   date:'',//巡检时间
				   round:'',//巡检伦次
				   tableArrester:[],//避雷器表
				   tableCabinet:[],//测控柜表
				   tableOthers:[],//其他 表
				   tablePressure:[],//气室压力表
				   tableTemperature:[],//温度表
				  //轮次列表
				  rounds: [{
				             value: 'all',
				             label: '第一次'
				           }, {
				             value: 'warning',
				             label: '第二次'
				           }, {
				             value: 'alarm',
				             label: '第三次'
				           }],

				   //表格
				   tableData: [{
				             no:'1',
							 startTime:'2020-12-31 11:53:29',
							 station:'北京热电厂',
							 equipment:'#4',
							 id:'E0204',
							 description:'11111111111111111111111111111111111',
							 value:'0',
							 level:'一级',
							 code:'E0204',
							 type:'阈值报警',
							 confirmTime:'',
							 confirmUser:'',
							 status:'未确认'
				           },{
				             no:'2',
							 startTime:'2020-12-31 11:53:29',
							 station:'北京热电厂',
							 equipment:'#4',
							 id:'E0204',
							 description:'11111111111111111111111111111111111',
							 value:'0',
							 level:'一级',
							 code:'E0204',
							 type:'阈值报警',
							 confirmTime:'',
							 confirmUser:'',
							 status:'未确认'
				           },{
				             no:'3',
							 startTime:'2020-12-31 11:53:29',
							 station:'北京热电厂',
							 equipment:'#4',
							 id:'E0204',
							 description:'11111111111111111111111111111111111',
							 value:'0',
							 level:'一级',
							 code:'E0204',
							 type:'阈值报警',
							 confirmTime:'',
							 confirmUser:'',
							 status:'未确认'
				           }
						   ]
			}
		},
		created() {
			
		},
		
		mounted() { 

		 }, 
		methods: {
			
			setZero(a) {//设置小于10的数字在加0
				return a < 10 ? "0" + a : a;
			},
			reset(){
				this.date='';
				this.round='';
				
			},
			search(){
					 this.axios.defaults.withCredentials = true;
					 this.axios.post('http://localhost:8080/food/selectbyid',{
						foodId:id
					 }).then(r=>{
							
					  });
			}
			
	
		}
	}
</script>

<style lang="less" scoped>
	.select{
		width:65%;
		height:80%;
	}
	
	.label{
		font-size: 14px;
	}
	

</style>
